<template>
  <div>
    <cus-search class="mb_20">
      <cus-search-item>
        <Form class="flex" ref="formValidate" :model="form" :label-width="120">
          <FormItem class="mr_48 mb_20" label="统计周期">
            <DatePicker
              v-model="form.statisticalDate"
              type="month"
              placeholder="请选择月份"
              :options="options"
              style="width: 200px"
            />
          </FormItem>
          <!-- <FormItem class="mr_48" label="审核状态:" prop="organAuditState">
            <Select
              v-model="form.organAuditState"
              placeholder="请选择"
              clearable
              style="width: 200px"
            >
              <Option :value="0">待审核</Option>
              <Option :value="1">已审核通过</Option>
              <Option :value="2">已驳回</Option>
            </Select>
          </FormItem> -->
          <FormItem class="mr_48 mb_20" label="提交状态" prop="submitStatus">
            <Select
              v-model="form.submitStatus"
              placeholder="请选择"
              clearable
              style="width: 200px"
            >
              <Option :value="0">未提交</Option>
              <Option :value="1">已提交</Option>
            </Select>
          </FormItem>
          <FormItem class="mr_48 mb_20" label="伙食单位" prop="unitCode">
            <Select
              v-model="form.unitCode"
              placeholder="请选择"
              clearable
              style="width: 200px"
            >
              <Option
                :value="item.unitCode"
                v-for="(item, index) in subCanteenList"
                :key="index"
                >{{ item.unitName }}</Option
              >
            </Select>
          </FormItem>
          <Button
            class="mr_24 mb_20"
            type="primary"
            @click="
              search();
            "
            >查询</Button
          >
          <Button class="mr_24 mb_20" type="default" @click="reset()">重置</Button>
        </Form>
      </cus-search-item>
    </cus-search>
    <div class="content-bottom">
    <cus-card> 
        <foodQuantificationTable ref="foodQuantificationTable" :form="form"></foodQuantificationTable>
    </cus-card>
  </div>
  </div>
</template>
<script>
import { getSubCanteenList } from "@/api/organ/organization";
import foodQuantificationTable from "./components/foodQuantificationTable.vue"
export default {
  components: { foodQuantificationTable },
  data() {
    return {
      form: {
        // organAuditState: null, // 审核状态
        submitStatus: null, //提交状态
        unitCode: null, // 伙食单位
        statisticalDate: new Date(
            new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 30) 
          ), //统计周期
      },
      subCanteenList: [], // 下级单位
      options: {
        shortcuts: [
          {
            text: "本月",
            value() {
              const start = new Date();
              start.setTime(start.getTime());
              return start;
            },
          },
          {
            text: "下月",
            value() {
              const start = new Date();
              start.setTime(start.getTime() + 3600 * 1000 * 24 * 30);
              return start;
            },
          },
        ],
      },
    };
  },
  mounted() {
    
    setTimeout(() => {
      this.tableHeight = window.innerHeight - 240; // 表格自适应高度
    }, 100);
    window.addEventListener("resize", this.tableHeightChange, true);
    this.getSubCanteenListApi();
  },
  methods: {
    search() {
      this.$refs['foodQuantificationTable'].onInit();
    },
    reset() {
      this.$refs["formValidate"].resetFields();
      this.form.statisticalDate =  new Date(new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 30)); 
      this.$refs['foodQuantificationTable'].onInit();
    },
    // 获取所有的伙食单位-----------------------接口
    getSubCanteenListApi() {
      this.loading = true;
      return new Promise((resolve) => {
        getSubCanteenList({
          currentPage: 1,
          pageSize: 1000,
        }).then((res) => {
          this.loading = false;
          if (res.code === 1) {
            this.subCanteenList = res.data.list;
            resolve();
          }
        });
      });
    },
    tableHeightChange() {
      this.tableHeight = 0;
      setTimeout(() => {
        this.tableHeight = window.innerHeight - 260; // 表格自适应高度
      }, 100);
    },
  },
  destroyed() {
    window.removeEventListener("resize", this.tableHeightChange, true);
  },
};
</script>
      <style lang="scss" scoped>
@import "./index.scss";
</style>
      